<template>
  <div class="info-detail">
    <Title></Title>
    <div class="contentbox">
      <h1 class="head black large bold" style="margin-bottom: 20px;">{{ info.title }}</h1>
      <!-- <ul class="items flex item-center">
        <li> <span class="">已读：</span> <span> {{ info.read_num }} </span> </li>
        <li> <span class="">发布人：</span> <span> {{ info.publish_user }} </span> </li>
        <li> <span class="">发布时间：</span> <span> {{ info.publish_time }} </span> </li>
      </ul> -->
      <div class="content">
        <div class="imgbox">
          <img v-if="info.show_tpdz" :src="info.show_tpdz" width="100%" alt="">
        </div>
        <div v-html="info.content"></div>
      </div>
    </div>
  </div>
</template>

<script>
import Title from '@/components/Title'
import Api from '@/api'
export default {
    components: {
        Title
    },
    data() {
      return {
        info: {}
      }
    },
    mounted() {
      this.getInfomation()
    },
    methods: {
      getInfomation() {
        const id = this.$route.params.id
        Api.getInfomation({id}).then(res => {
          this.info = res.data || {}
        })
      }
    }
}
</script>

<style lang="scss" scoped>
.info-detail {
  .contentbox {
    padding: 20px;
    .head {
      text-align: center;
      
    }
    .items {
        margin: 10px 0;
        li {
          margin-right: 20px;
        }
      }
    .content {
      min-height: 500px;
      padding: 10px;
      border: 1px solid #eee;
      .imgbox {
        margin-bottom: 20px;
      }
    }
  }
}
</style>>
